import Taro, { Component } from '@tarojs/taro'
import { View , Text , Image} from '@tarojs/components';
import { baseImgSrc } from '../../util/base_url';
import NoLogin from '../../components/nologin/nologin';
import { AtButton } from 'taro-ui';
import './tabuser.scss';
import { getToken , setToken } from '../../util/globaldata';
import { lgout , getUserInfo } from '../../util/api';
export default class TabList extends Component {
    config = {
        navigationBarTitleText:"我的",
        navigationBarBackgroundColor:"#5FCF92",
    }
    constructor(){
        super(...arguments);
        this.state = {
            userList:[
                {imgPath:"/menu1.png",clName:'',name:"钱包",subtxt:"",path:"/pages/moneycard/moneycard",eventType:"link"},
                {imgPath:"/menu2.png",clName:'',name:"消息",subtxt:"",path:"",eventType:"link"},
                {imgPath:"/menu3.png",clName:'',name:"我的订单",subtxt:"",path:"/pages/orderlist/orderlist",eventType:"link"},
                {imgPath:"/menu4.png",clName:'',name:"实名认证",subtxt:"",path:"/pages/idauth/idauth",eventType:"check",userRole:1},
                {imgPath:"/menu4.png",clName:'',name:"驾驶证认证",subtxt:"",path:"/pages/idauth/idauth",eventType:"check",userRole:2},
                {imgPath:"/menu5.png",clName:'',name:"客服热线",subtxt:"400-666888",path:"",eventType:"call"},
                {imgPath:"/menu6.png",clName:'',name:"关于我们",subtxt:"",path:"/pages/about/about",eventType:"link"},
                {imgPath:"/menu9.png",clName:'big-pic',name:"安全中心",subtxt:"",path:"/pages/question/question",eventType:"link"},
                {imgPath:"/menu8.png",clName:'',name:"意见反馈",subtxt:"",path:"/pages/suggest/suggest",eventType:"link"}
            ],
            userRole:1,
            isLogin:false,
            userHeading:"",
            userName:"",
            userTel:"",
            idAuthStatus:false,
        }
    }
    componentDidShow(){
        this.setState({
            isLogin:getToken() != null
        },() => {
            getUserInfo({},true).then(res => {
                if(res.code == 0){
                    let { userList  } = this.state;
                    userList[5].subtxt = res.data.tel;
                    this.setState({
                        userHeading:res.data.headimg,
                        userName:res.data.nickname,
                        userTel:res.data.phone,
                        userList,
                        idAuthStatus:res.data.status,
                        driverStatus:res.data.state,
                    })
                }
            })
        })
    }
    toPage(eventType,item){
        switch(eventType){
            case 'link':
                Taro.navigateTo({url:item.path})
            break;
            case 'call':
                Taro.makePhoneCall({
                    phoneNumber: item.subtxt //仅为示例，并非真实的电话号码
                })
            break;
            case 'check':  // 0是审核中1成功2拒绝3是未认证
                let { idAuthStatus , driverStatus } = this.state;
                let  checkStatus = item.userRole == 1 ? idAuthStatus : driverStatus;
                if(checkStatus == 0){ //认证中
                    Taro.navigateTo({
                        url:`${item.path}?model=3`
                    })
                }else if(checkStatus == 1){ //认证成功
                    Taro.navigateTo({
                        url:`${item.path}?model=2`
                    })
                }else if(checkStatus == 2){
                    let model = item.userRole == 1 ? 4 : 5;
                    Taro.navigateTo({
                        url:`${item.path}?model=${model}`
                    })
                }else if(checkStatus == 3){
                    if(item.userRole == 1 ){ //实名认证
                        Taro.navigateTo({
                            url:`${item.path}?model=1`
                        })
                    }else if(item.userRole == 2){ //驾驶证认证
                        Taro.navigateTo({
                            url:`/pages/applyOne/applyOne`,
                        })
                    }
                }
            break;
        }
    }
    toUserPage(){
        Taro.navigateTo({
            url:"/pages/userinfo/userinfo",
        })
    }
    loginOut(){
        Taro.showModal({
            title:"提示",
            content:"确定退出登录吗"
        }).then(res => {
            if(res.confirm){
                lgout().then(res => {
                    if(res.code == 0){
                        Taro.showToast({title:"退出成功"});
                        setToken('');
                        Taro.switchTab({url:'/pages/tabmain/tabmain'});
                    }
                })
            }
        })
    }
    render(){
        let { userList  , isLogin , userHeading , userName , userTel } = this.state;
        return (
            <View className='tabuser'>
                {
                  isLogin ? <View className='user-box'>
                                <View className='info-card flex align-items space-between' onClick={this.toUserPage.bind(this)}>
                                    <Image className='heading' src={userHeading} />
                                    <View className='middle flex1'>
                                        <View className='name'>{userName}</View>
                                        <View className='phone'>{userTel}</View>
                                    </View>
                                </View>
                                <View className='menu-list'>
                                    {
                                        userList.map( (v,i) => (
                                            i == 1 ? (
                                                <View className='item'>
                                                    <AtButton className='message-btn flex align-items space-between' openType='contact'>
                                                        <View className='message-txt flex1 flex align-items space-between'>
                                                            <Image className='menu-image' src={`${baseImgSrc}${v.imgPath}`} />
                                                            <View className='menu-txt flex1 flex align-items space-between'>
                                                                <View className='left'>{v.name}</View>
                                                                <View className='right flex align-items flex-end'>
                                                                    <Text className='right-l' >{v.subtxt}</Text>
                                                                    <Text className='iconfont iconarrow-right'></Text>
                                                                </View>
                                                            </View>
                                                        </View>
                                                    </AtButton>
                                                </View>
                                            ) : (
                                                <View className='item flex align-items space-between' onClick={this.toPage.bind(this,v.eventType,v)}>
                                                    <Image className={'menu-image '+ v.clName} src={`${baseImgSrc}${v.imgPath}`} />
                                                    <View className='menu-txt flex1 flex align-items space-between'>
                                                        <View className='left'>{v.name}</View>
                                                        <View className='right flex align-items flex-end'>
                                                            <Text className='right-l' >{v.subtxt}</Text>
                                                            <Text className='iconfont iconarrow-right'></Text>
                                                        </View>
                                                    </View>
                                                </View>
                                            )
                                            
                                        ))
                                    }
                                </View>
                                <View className='lgout fn-ctr' onClick={this.loginOut.bind(this)}>退出账号</View>
                  </View>  :  <NoLogin />
                }
            </View>
        )
   }
}
